<template>
    <div>
        <h1>门店信息</h1>
        <a href="/Add">前往添加</a>
        <br>
        门店名称:
        <input type="text" v-model="find.name">
        <input type="button" value="查询" @click="listshow">
        <table class="table">
            <thead>
            <tr>
                <td>门店编号</td>
                <td>门店名称</td>
                <td>门店地址</td>
                <td>门店电话</td>
                <td>门店详情</td>
                <td>操作</td>
            </tr>
        </thead>
        <tbody>
            <tr v-for="d in data">
                <td>{{d.Id}}</td>
                <td>{{d.Name}}</td>
                <td>{{d.Addr}}</td>
                <td>{{d.Phone}}</td>
                <td>{{d.XQ}}</td>
                <td>
                    <input type="button" value="详情" @click="Getxq(d.Id)">
                </td>
            </tr>
        </tbody>
        </table>
        <span>
            一共{{ fysy.totalnum}}条,分为{{ fysy.totalpage }}页,
            每页{{ find.pagesize }}条,当前为{{ find.pageindex }}页
        </span>
        <input type="button" value="首页" @click="FY(1)">
        <input type="button" value="上一页" @click="FY(find.pageindex-1)">
        <input type="button" value="下一页" @click="FY(find.pageindex+1)">
        <input type="button" value="尾页" @click="FY(fysy.totalpage)">
    </div>
</template>

<script setup lang="ts">
import {ref,onMounted} from 'vue';
import axios from 'axios';
import { useRouter } from 'vue-router';

//查询用
const find=ref({
    name:"",
    pageindex:1,
    pagesize:2
})

//翻页使用
const fysy=ref({
totalnum:0,
totalpage:0
})

//循环
const data=ref([{
    "Id": 0,
  "Name": "",
  "Addr": "",
  "Phone": "",
  "XQ": ""
}])


onMounted(() => {
    Shows();
})

//显示
const Shows=()=>{
    axios.get("https://localhost:7210/api/MD/Getmd",{params:find.value}).then(
        res=>{
            data.value=res.data.list;
            fysy.value.totalnum=res.data.totalnum;
            fysy.value.totalpage=Math.ceil(fysy.value.totalnum/find.value.pagesize);
        }
    )
}

//翻页
const FY=(vid:any)=>{
    if(vid>=1 &&  vid<=fysy.value.totalpage){
        find.value.pageindex=vid;
        Shows();
    }
}



//查询
const listshow=()=>{
    find.value.pageindex=1;
    Shows()
}

var route=useRouter();
//详情
const Getxq=(vid:any)=>{
    localStorage["id"]=vid;
    location.href='/XQ';
}


</script>

<style scoped>

</style>